<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>精品民宿</title>
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
    </script>

    <script type="text/javascript" src="https://cdn.bootcss.com/jquery.serializeJSON/2.9.0/jquery.serializejson.js"></script>

    <!--全局样式-->
    <style type="text/css">
        body{
            background-image: url(http://47.105.208.60:8080/wechat-api/images/loginbg.png);
            background-position: center center;
            background-repeat: no-repeat;
            background-attachment: fixed;
            background-size: cover;
        }
        form#index {
            margin-left:auto;
            margin-right:auto;
            max-width: 500px;
            background: #F7F7F7;
            opacity:0.95;
            padding: 25px 15px 25px 10px;
            font: 12px Georgia, "Times New Roman", Times, serif;
            color: #888;
            text-shadow: 1px 1px 1px #FFF;
            border:1px solid #E4E4E4;
            text-align:center;
        }
        form#index h3 {
            font-size: 25px;
            padding: 0px 0px 10px 40px;
            display: block;
            border-bottom:1px solid #E4E4E4;
            margin: -10px -15px 30px -10px;;
            color: #888;
            text-align:center;
        }
        form#index label {
            display: block;
            margin: 0px;
        }
        form#index label>span {
            float: left;
            width: 20%;
            text-align: right;
            padding-right: 10px;
            margin-top: 10px;
            color: #888;
        }
        form#index input[type="text"], form#index input[type="number"] {
            border: 1px solid #DADADA;
            color: #888;
            height: 30px;
            margin-bottom: 16px;
            margin-right: 6px;
            margin-top: 2px;
            outline: 0 none;
            padding: 3px 3px 3px 5px;
            width: 70%;
            font-size: 12px;
            line-height:15px;
            box-shadow: inset 0px 1px 4px #ECECEC;
            -moz-box-shadow: inset 0px 1px 4px #ECECEC;
            -webkit-box-shadow: inset 0px 1px 4px #ECECEC;
        }
        form#index .button {
            background: #E27575;
            border: none;
            padding: 10px 25px 10px 25px;
            color: #FFF;
            box-shadow: 1px 1px 5px #B6B6B6;
            border-radius: 3px;
            text-shadow: 1px 1px 1px #9E3F3F;
            cursor: pointer;
        }
        form#index label .container{
            width: 300px;
            height: 30px;
            background-color: greenyellow;
            margin-left:auto;margin-right:auto;

        }
        form#index label>span #progress {
            height: 20px;
            background-color: darkgray;
            display: inline-block;
            padding: 3px 0 0 0;
        }

    </style>

    <script>

        function chaxunscenery() {
            $.ajax({
                url: "http://47.105.208.60:8080/wechat-api/homestay/findByEid",
                //url:"/homestay/findByEid",
                data:
                    JSON.stringify($('#index').serializeJSON()),
                type: 'POST',
                dataType: "json",
                contentType:"application/json",
                success : function(data) {
                    console.log("+++++++++")
                    console.log(data)

                    if(data.eid != ""){
                        alert("您好,该编号已存在")
                        $("input").attr("disabled",true);
                    }

                },error: function(err){
                    console.log("----------")
                    console.log(err)
                }
            });
        }


        //数据提交
        function insert() {
            var count = 0;
            var checkArry = document.getElementsByName("etype");
            check_val=[];
            for (var i = 0; i < checkArry.length; i++) {
                if(checkArry[i].checked == true){
                    //选中的操作
                    count++;
                    check_val.push(checkArry[i].value)
                    console.log(check_val);
                }
            }
            if( count == 0 ){
                alert("请选择类型")
                return false;
            }

            $.ajax({
                url: "http://47.105.208.60:8080/wechat-api/homestay/saveHomestay",
                //url:"/homestay/saveHomestay",
                data:
                    JSON.stringify($('#index').serializeJSON()),
                type: 'POST',
                dataType: "json",
                contentType:"application/json",
                success : function(data) {
                    console.log("+++++++++")
                    console.log(data)
                    alert("提交成功")
                    document.getElementById("index").reset();

                    window.location.href="/a#(CPATH)/admin/rural";

                },error: function(err){
                    console.log("----------")
                    console.log(err)
                    alert("提交失败")
                }
            });
        }

    </script>
</head>
<body>

<form id="index" onsubmit="return false" action="##" method="post" >
    <h3 style="align-content: center">精品民宿</h3>
    <label>
        <span>家庭编号:</span>
        <input type="text" name="eid" class="eid" id="eid" onblur="chaxunscenery()">
    </label>
    <label>
        <span>家庭名称:</span>
        <input type="text" name="name" class="name" id="name">
    </label>
    <label>
        <span>家庭地址:</span>
        <input type="text" name="address" class="address" id="address">
    </label>
    <label>
        <span>经度:</span>
        <input type="text" name="longitude" class="longitude" id="longitude">
    </label>
    <label>
        <span>纬度:</span>
        <input type="text" name="latitude" class="latitude" id="latitude">
    </label>
    <label>
        <span>类型:</span>
        <input type="checkbox" name="etype" value="农家乐名宿" id="etype1">农家乐名宿
    </label><br>
    <label>
        <span>简介:</span>
        <input type="text" name="summary" class="summary" id="summary" >
    </label>

    <label>
        <span>上报人:</span>
        <input type="text" name="report" class="report" id="report">
    </label>
    <label>
        <span>联系人: </span>
        <input type="text" name="username" class="username" id="username">
    </label>
    <label>
        <span>联系电话:</span>
        <input type="number" name="userphone" class="userphone" id="userphone">
    </label>

    <input  type="button" class="button" value="提交" onclick="insert()">&nbsp;&nbsp;&nbsp;
    <input  type="reset" class="button" value="重置" >


</form>

</body>
</html>